<!DOCTYPE html>
<html lang="zh">
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<meta http-equiv="X-UA-Compatible" content="ie=edge">
		<title></title>
		<link rel="stylesheet" type="text/css" href="static/assets/global/plugins/bootstrap/css/bootstrap.min.css" />
		<link rel="stylesheet" type="text/css" href="static/assets/global/css/components.css" />
		<link rel="stylesheet" type="text/css" href="static/assets/admin/pages/css/login.css" />
		<script type="text/javascript" src="static/assets/global/plugins/jquery-1.11.0.min.js"></script>
	</head>
	<body class="login">
		<div class="content">
			<h3 class="form-title">商品详情</h3>
			<div id="promoStartDateContainer" class="form-group">
				<label style="color: red;" class="control-label">秒杀开始时间</label>
				<div>
					<label style="color: red;" class="form-control" id="promoStartDate" />
				</div>
			</div>
			<div class="form-group">
				<div>
					<label class="form-control" id="title" />
				</div>
			</div>
			<div class="form-group">
				<label class="control-label">商品描述</label>
				<div>
					<label class="form-control" id="description" />
				</div>
			</div>
			<div id = "normalPriceContainer" class="form-group">
				<label class="control-label">价格</label>
				<div>
					<label class="form-control" id="price" />
				</div>
			</div>
			<div id="promoPriceContainer" class="form-group">
				<label style="color: red;" class="control-label">秒杀价格</label>
				<div>
					<label style="color: red;" class="form-control" id="promoPrice" />
				</div>
			</div>
			<div class="form-group">
				<div>
					<img style="width: 200px;height: auto;" id="imgUrl" />
				</div>
			</div>
			<div class="form-group">
				<label class="control-label">库存</label>
				<div>
					<label class="form-control" id="stock" />
				</div>
			</div>
			<div class="form-group">
				<label class="control-label">销量</label>
				<div>
					<label class="form-control" id="sales" />
				</div>
			</div>
			<div class="form-actions">
				<button class="btn blue" type="submit" id="createorder">
					下单
				</button>
			</div>
		</div>
	</body>
	<script>
		function getParam(paramName) {
			paramValue = "", isFound = !1;
			if (this.location.search.indexOf("?") == 0 && this.location.search.indexOf("=") > 1) {
				arrSource = unescape(this.location.search).substring(1, this.location.search.length).split("&"), i = 0;
				while (i < arrSource.length && !isFound) arrSource[i].indexOf("=") > 0 && arrSource[i].split("=")[0].toLowerCase() ==
					paramName.toLowerCase() && (paramValue = arrSource[i].split("=")[1], isFound = !0), i++
			}
			return paramValue == "" && (paramValue = null), paramValue
		}
		var g_itemVO = {};
		jQuery(document).ready(function() {
			$("#createorder").on("click", function() {
				$.ajax({
					type: "POST",
					contentType:"application/x-www-form-urlencoded",
					url: "http://localhost:8090/order/createorder",
					data: {
						"itemId": g_itemVO.id,
						"amount": 1,
						"promoId": g_itemVO.promoId
					},
					xhrFields: {
						withCredentials: true
					},
					success: function(data) {
						if (data.status == "success") {
							alert("下单成功");
							window.location.reload();
						} else {
							alert("下单失败，原因为" + data.data.errMsg);
							if (data.data.errCode = 20003) {
								window.location.href = "login.html";
							}
						}
					},
					error: function(data) {
						alert("下单失败，原因为:" + data.responseText);
					}
				})
			});
			$.ajax({
				type: "GET",
				contentType:"application/x-www-form-urlencoded",
				url: "http://localhost:8090/item/get",
				data: {
					"id": getParam("id")
				},
				xhrFields: {
					withCredentials: true
				},
				success: function(data) {
					if (data.status == "success") {
						g_itemVO = data.data;
						reloadDom();
						setInterval(reloadDom,1000);
					} else {
						alert("获取信息失败，原因为" + data.data.errMsg);
					}
				},
				error: function(data) {
					alert("获取信息失败，原因为" + data.responseText);
				}
			})
		});

		function reloadDom() {
			$("#title").text(g_itemVO.title);
			$("#description").text(g_itemVO.description);
			$("#stock").text(g_itemVO.stock);
			$("#price").text(g_itemVO.price);
			$("#imgUrl").attr("src", g_itemVO.imgUrl);
			$("#sales").text(g_itemVO.sales);
			if (g_itemVO.promoStatus == 1) {
				// 秒杀活动还未开始
				var startTime = g_itemVO.startDate.replace(new RegExp("-","gm"),"/");
				startTime = (new Date(startTime)).getTime();
				var nowTime = Date.parse(new Date());
				var delta = (startTime - nowTime)/1000;
				if (delta <= 0) {
					// 活动开始了
					g_itemVO.promoStatus = 2;
					reloadDom();
				}
				$("#promoStartDate").text("秒杀活动将于：" + g_itemVO.startDate + "开始售卖 倒计时：" + delta + " 秒");
				$("#promoPrice").text(g_itemVO.promoPrice);
				$("#createorder").attr("disabled", true);
			} else if(g_itemVO.promoStatus == 2) {
				$("#promoStartDate").text("秒杀正在进行中");
				$("#promoPrice").text(g_itemVO.promoPrice);
				$("#createorder").attr("disabled", false);
				$("#normalPriceContainer").hide();
			}
				
		}
	</script>
</html>
